<!--
 * @Author: 渣佳黎一 11965612+zha-jia-li-yi@user.noreply.gitee.com
 * @Date: 2023-06-14 11:06:54
 * @LastEditors: hi_wujiajun hi_wujiajun@163.com
 * @LastEditTime: 2023-09-14 20:54:05
 * @FilePath: \前端所有笔记\04-Ajax\10-登录案例.html
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AEusername
-->
<!DOCTYPE html>
<html lang="en">


<head>

    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>案例</title>

    <!-- <script src="./lib/form-serialize.js"></script>
    <link rel="stylesheet" href="./lib/bootstrap.css">
    <script src="./lib/jquery.js"></script>
    <script src="../04-Ajax/code/js/bootstrap.js"></script> -->
<link rel="stylesheet" href="../login/server.css">
</head>

<body>

    <div class="container">
        <h3>欢迎-登录</h3>
        <!-- 提示框 -->
        <div class="alert alert-success" role="alert">
            提示信息
        </div>
        <!-- 表单 -->
        <div class="form_warp">
            <form class='login-form'>
                <div class="mb-3">
                    <label for="username" class="form-label">手机号</label>
                    <input type="text" class="form-control " name='mobile' value="15502774572">
                </div>
                <div class="mb-3">
                    <label for="password" class="form-label">密码</label>
                    <input type="password" class="form-control " name="password" value='123456'>
                </div>
                <button type="button" class="btn btn-primary btn-login">登录</button>
            </form>
        </div>
    </div>
    <!-- <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script> -->
    <!-- <script>
        document.querySelector('.btn').addEventListener('click', function(){
            const phone=document.querySelector('.login-form [name=mobile]').value 
            console.log(phone)
            const code=document.querySelector('.login-form [name=password]').value
            console.log(code)
        })
    </script> -->
    <!-- <script src="../src/login/server.js"></script> -->
</body>
<!-- <script src="../login/server.css"></script> -->
<!-- // document.querySelector('.btn-login').addEventListener('click', () => {
    //     const username = document.querySelector('.username').value;
    //     const password = document.querySelector('.password').value;
    //     if (username.length < 8) {
    //         console.log('用户名必须大于八位')
    //         return //阻止代码继续执行

    //     }
    //     if (password.length < 6) {
    //         console.log('密码必须大于6位')
    //         return  //阻止代码继续执行
    //     }

    //     axios({
    //         url: 'http://hmajax.itheima.net/api/login',
    //         method: 'POST',
    //         data: {
    //             username,
    //             password
    //         }
    //     }).then(result => {
    //         console.log(result);
    //         console.log(result.data.message);//快速获取路径，右键复制路径。
    //     }).error(erroe => {
    //         console.log(error);
    //         console.log(error.response.data.message);
    //     })
    // })
    // document.querySelector('.login-form').addEventListener('click', () => {
    //     const form = document.querySelector('.login-form');
    //     const data = serialize(form, { hash: true, empty: true });
    //     console.log(data);
    //     const { username, password } = data;
    //     console.log(username, password);
    // })
 -->



</html>